<template>
    <div>
        <p v-bind:class="pStys">{{myp}}</p>
        <ul>
            <li :class="[{activity:item%2==0}, 'info-'+item]" v-for="(name,item) in names" :key="item"> {{ name }} </li>
        </ul>
    </div>
</template>
<script>
export default {
    name:"styles",
    data(){
        return {
            myp:"p标签",
            chose:1,
            isActive:1,
            names:[
                    "xm",
                    "xl",
                    "xb",
                ],
        }
    },
    computed:{
        pStys:function(){
            return {
                activity:this.chose==1?true:false,
                demo:this.chose==1?false:true,
            
            }
        }
    }
}
</script>
<style>
    .activity{
        color:red;
    }
    .demo{
        height:20px;
    }
</style>


